<!--
 * @Description: 任务追溯
 * @Author: lwx
 * @Date: 2022-12-01 09:06:31
 * @LastEditors: lwx
 * @LastEditTime: 2023-04-27 17:26:42
-->
<template>
 <!-- 任务追溯 -->
  <div class="fillcontain">
    <div class="searchArea" >
      <el-form size="mini" :inline="true">
        <el-form-item label="订单号：">
          <el-input 
            v-model="order_no" 
            placeholder="请输入" 
            clearable>
          </el-input>
        </el-form-item>
        <el-form-item>
          <el-button 
            type="success" 
            size="mini" 
            icon="el-icon-search"
            @click="getOrderTask()"
            >查询
          </el-button>
        </el-form-item>
      </el-form>
     </div>
     <div class="table_container pb-3">
       <el-table
         size="mini"
         border
         :data="taskList"
         style="width: 100%"
         align="center">
        <el-table-column type="expand">
          <template slot-scope="scope">
            <el-table
              :data="scope.row.trace_list"
              style="width: 100%"
              align="center">
               <el-table-column 
                 label="序号" 
                 width="120">
                <template slot-scope="scope2">
                  <span>{{scope2.$index+1}}</span>        
                </template>
               </el-table-column>     
              <el-table-column 
                label="产品总码"
                width="250">
                <template slot-scope="scope2">
                    {{scope2.row}}
                </template>
              </el-table-column>
              <el-table-column 
                label="操作">
                <template slot-scope="scope2">
                  <el-button type="success" size="mini" @click="toReport(scope2.row,scope.row.product_name)">报表</el-button>
                </template>
              </el-table-column>
            </el-table>
          </template>
         </el-table-column>
         <el-table-column
           prop="work_no"
           label="任务编号"
           align="center"
           sortable="">
         </el-table-column>
         <el-table-column
           prop="task_name"
           label="任务名称"
           align="center">
         </el-table-column>
         <el-table-column
           prop="product_no"
           label="产品编号"
           align="center">
         </el-table-column>
         <el-table-column
           prop="product_name"
           label="产品名称"
           align="center">
         </el-table-column>
         <el-table-column
           prop="amount"
           label="任务数量"
           align="center">
         </el-table-column>
         <el-table-column
           prop="task_done"
           label="完成数量"
           align="center">
         </el-table-column>
         <el-table-column
           prop="process_code"
           label="工艺代号"
           align="center">
         </el-table-column>
         <el-table-column
           prop="info"
           label="电堆条码"
           align="center">
         </el-table-column>
         <el-table-column
           label="任务状态"
           align="center">
           <template slot-scope="scope">
             <el-tag type="success">{{scope.row.task_status}}</el-tag>
           </template>
         </el-table-column>
       </el-table>
     </div>
  </div>
</template>

<script>
import {orderTask} from '@/api/task.js'
export default {
  data () {
    return {
      taskList:[],
      order_no:''
    }
  },
   created(){
   if(this.$route.query&&this.$route.query.order_no){
    this.order_no=this.$route.query.order_no
     this.getOrderTask()//获取订单下任务
   }
 },
  methods:{
    //获取订单任务
   async getOrderTask(){
     let params={
      order_no:this.order_no,
      is_trace:1
     }
     const {data}= await orderTask(params)
     this.taskList=data  
    },
   toReport(barcodes,product_name){
    this.$router.push({path:'/his/report',query:{barcodes,product_name}})
   }
  }
}
</script>
<style lang='scss' scoped>
</style>